import { Location, LocationStrategy, PathLocationStrategy } from '@angular/common';
import { Component, OnInit, ViewChild, ChangeDetectorRef} from '@angular/core';
// import { ToastService, UploadConfig } from 'ng-tui';
import { GlobalService, AuthService } from '../../../../cores/services';
import { ManageService } from '../../services/manage.service';
import { Manage } from '../../interfaces/manage.interface';
import { ActivatedRoute, Router } from '@angular/router';
import { Pagination, ConfirmService, ToastService, Item, MapService, MapStyles, MapEvent} from 'ng-tui';
import { ApiData, SearchParams } from '../../../../cores/classes';
import { Goods } from '../../interfaces/manage.interface';
import { skipWhile, switchMap } from 'rxjs/operators';

@Component({
    templateUrl: './patrol.component.html',
    providers: [Location, { provide: LocationStrategy, useClass: PathLocationStrategy }],
})
export class PatrolComponent implements OnInit {
    @ViewChild('map') map: any;
    theads = ['#', '员工编号', '员工姓名', '职位', '操作'];
    billTh = ['#', '巡店日期', '巡店路线', '路线客户数', '巡店客户数', '差异客户数', '状态', '操作'];
    orderTh = ['#', '区域', '客户名称', '进店时间', '离店时间', '停留时长', '抄单情况', '理货照片', '特陈照片', '操作'];
    isSee = false;
    search = new SearchParams({ start: '', end: '' });

    list = new Array<Goods>();

    loading = false;

    pagination = new Pagination();
    parentTypes = new Array<Item>();
    childTypes = new Array<any>();
    goodsThreeType = new Array<any>();
    goods: Goods = { id: 0, isActive: 1, goodsName: '' };
    mapStatus = false;
    consoleLog: { [key: string]: any } = {
        message: '点击对应按钮，获取调用结果'
    };

    get getChildTypes(): Item[] {
        return this.childTypes.filter(type => type.parentId === this.goods.goodsParentType);
    }
    get getThreeTypes(): Item[] {
        return this.childTypes.filter(type => type.parentId === this.goods.goodsParentType);
    }
    constructor(
        private activatedRoute: ActivatedRoute,
        private router: Router,
        private confirm: ConfirmService,
        private toast: ToastService,
        public global: GlobalService,
        private manageService: ManageService,
        private mapService: MapService,
        private changeDetectorRef: ChangeDetectorRef
    ) { }

    ngOnInit() {

        // this.activatedRoute.url
        //     .pipe(skipWhile(() => this.router.url !== '/manage/account'))
        //     .subscribe(() => this.loadDatas());
        this.mapService.doFuc((AMap) => {
            this.mapStatus = true;
            this.map.setMarker([116.480983, 40.0958]);
            this.changeDetectorRef.detectChanges();
            // 添加自动补全插件
            AMap.plugin('AMap.Autocomplete', () => {
                return new AMap.Autocomplete({ input: 'search_input' });
            });
        });
    }
    getPointInfo(point: [number, number] = [116.396574, 39.992706]) {
        this.mapService.getAddressByPosition(point).subscribe(res => {
            this.consoleLog = res;
            // 这里的数据无法实时更新到视图中，需要手动刷新视图
            this.changeDetectorRef.detectChanges();
        });
    }
    getPosition(event: MapEvent) {
        const point: [number, number] = [event.lnglat.getLng(), event.lnglat.getLat()];
        console.log(point);
        // 解析坐标地址，通过经纬度获取真实地址
        this.getPointInfo(point);
        this.map.setMarker(point);
    }

    // doSearch() {
    //     this.pagination.reset();
    //     this.loadDatas();
    // }

    // doReset() {
    //     this.search.clean();
    //     this.doSearch();
    // }

    loadDatas() {
        this.loading = true;
        this.manageService.searchGoods(this.pagination, this.search)
            .subscribe({
                next: res => {
                    this.pagination.total = res.datas.total;
                    this.list = res.datas.rows;
                },
                complete: () => this.loading = false
            });
    }

    // confirmDelete(goods: Goods) {
    //     this.confirm.danger('删除确认', `您确认删除商品'${goods.goodsName}'吗？`)
    //         .pipe(switchMap<void, ApiData>(() => this.manageService.deleteGoods(goods.id)))
    //         .subscribe(() => {
    //             this.list.splice(this.list.indexOf(goods), 1);
    //             this.toast.success('删除成功', `成功删除商品'${goods.goodsName}`);
    //             this.loadDatas();
    //         });
    // }

}
